<template>
  <div>
    <dialog-edit :visible.sync="dialogVisible" :title="$attrs.title" ref="userManageEdit" width="1000" :destroyOnClose="true"
                 height="380" :fullscreen="true" @save="save" :saveLoading="saveLoading">
      <template slot="body">
        <el-card>
          <dym-form :formData="localFormData" :components="components" :formRules="formRules"
                    ref="dymForm" @uploadSuccess="uploadSuccess"></dym-form>
        </el-card>
      </template>
    </dialog-edit>
  </div>
</template>

<script>
import dialogEdit from '@/components/element/dialogEdit'
import dymForm from '@/components/element/dymForm'
import SelectProjectModule from "@/components/element/select/SelectProjectModule";
import projectTestApi from "../../../../api/projectTestApi";
import EditorBar from '@/components/element/wangeditor'
import SelectProjectTeam from "@/components/element/select/SelectProjectTeam";
import DictionarySelect from "@/components/element/select/DictionarySelect";
import btnUpload from '@/components/element/btnUpload'
export default {
  name: 'ProjectManageTestAdd',
  components: {
    dialogEdit,
    dymForm,
    SelectProjectModule,
    EditorBar,
    SelectProjectTeam
  },
  computed: {
    dialogVisible: {
      get: function () {
        return this.visible
      },
      set: function (value) {
        this.$emit('update:visible', value)
      }
    }
  },
  props: {
    editModel: {
      type: String,
      default() {
        return 'C';
      }
    },
    visible: {
      type: Boolean,
      default() {
        return false;
      }
    },
    formData: {
      type: Object,
      default() {
        return {};
      }
    }
  },
  data() {
    return {
      saveLoading: false,
      localFormData: {},
      components: [
        {
          label: '模块',
          span: 24,
          placeholder: '请选择模块',
          prop: 'Projectmoduleid',
          value: 'Projectmoduleid',
          selectTitle: '模块',
          componentName: SelectProjectModule
        },
        {
          label: '指派给',
          span: 24,
          placeholder: '请选择指派人',
          prop: 'Acceptid',
          value: 'Acceptid',
          attrs: {
            filterable: true
          },
          componentName: SelectProjectTeam
        },
        {
          label: '分类',
          span: 24,
          placeholder: '请选择分类',
          prop: 'Type',
          value: 'Type',
          componentName: DictionarySelect,
          dictTypeCode: 'TEST_TYPE'
        },
        {
          label: '状态',
          span: 24,
          placeholder: '请选择状态',
          prop: 'Status',
          value: 'Status',
          componentName: DictionarySelect,
          dictTypeCode: 'TEST_STATUS'
        },
        {
          label: '反馈标题',
          span: 24,
          placeholder: '请输入反馈标题',
          prop: 'Name',
          value: 'Name',
          maxLength: 200,
          componentName: 'vxe-input',
        },
        {
          label: '优先级',
          span: 24,
          placeholder: '请选择优先级',
          prop: 'Level',
          value: 'Level',
          componentName: DictionarySelect,
          dictTypeCode: 'LEVEL'
        },
        {
          label: '描述',
          span: 24,
          placeholder: '请输入描述',
          prop: 'Desc',
          value: 'Desc',
          componentName: EditorBar,
          attrs: {
            width: '100%',
            height: '500px'
          }
        },
        {
          label: '操作系统',
          span: 12,
          placeholder: '请选择操作系统',
          prop: 'Os',
          value: 'Os',
          componentName: DictionarySelect,
          dictTypeCode: 'OS'
        },
        {
          label: '',
          span: 12,
          placeholder: '请选择浏览器',
          prop: 'Browser',
          value: 'Browser',
          componentName: DictionarySelect,
          dictTypeCode: 'BROWSER'
        },
        {
          label: '是否客户确认',
          span: 24,
          placeholder: '请选择是否客户确认',
          prop: 'Bussconfirmstatus',
          value: 'Bussconfirmstatus',
          componentName: DictionarySelect,
          dictTypeCode: 'BUSSCONFIRM_STATUS'
        },
        {
          label: '反馈环境',
          span: 24,
          placeholder: '请选择反馈环境',
          prop: 'Env',
          value: 'Env',
          componentName: DictionarySelect,
          dictTypeCode: 'ENV'
        },
        {
          label: '附件',
          span: 12,
          placeholder: '',
          prop: 'Attachment',
          value: 'Attachment',
          attrs: {
            uploadApi: '/v1/upload/',
            label: '上传附件'
          },
          componentName: btnUpload,
          type: 'file'
        }
      ],
      formRules: {
        Projectmoduleid: [{required: true, message: '请选择模块'}],
        Type: [{required: true, message: '请选择分类'}],
        Name: [{required: true, message: '请输入反馈标题'}],
        Desc: [{required: true, message: '请添加描述'}],
        Level: [{required: true, message: '请选择优先级'}],
        Env: [{required: true, message: '请选择反馈环境'}]
      }
    }
  },
  methods: {
    uploadSuccess (val) {
      this.localFormData.Attachmentname = val[0].fileName
    },
    save () {
      this.$refs.dymForm.$refs.form.validate().then(() => {
        this.saveSubmit()
      }).catch((_) => {
        console.log(_);
        this.$XModal.message({message: '表单填写错误，请检查', status: 'error'})
      })
    },
    saveSubmit () {
      if (this.editModel === 'C') {
        this.saveLoading = true
        projectTestApi.create(Object.assign({ Projectid: this.$route.params.id }, this.localFormData)).then(res => {
          this.$XModal.message({message: res.message, status: res.code === 1 ? 'success' : 'error'})
          this.dialogVisible = false
          if (this.$parent.search) {
            this.$parent.search()
          }
          if (res.code === 1) {
            this.$emit('successClose')
          }
        }).finally(() => {
          this.saveLoading = false
        })
      }
      if (this.editModel === 'E') {
        this.saveLoading = true
        projectTestApi.getEdit(Object.assign({ id: this.localFormData.Id }, this.localFormData)).then(res => {
          this.$XModal.message({message: res.message, status: res.code === 1 ? 'success' : 'error'})
          this.dialogVisible = false
          this.$parent.search()
        }).finally(() => {
          this.saveLoading = false
        })
      }
    },
    initHandleData () {
      if (this.localFormData.hasOwnProperty('Projectmoduleid')) {
        this.localFormData.Projectmoduleid = this.localFormData.Projectmoduleid.toString()
      }
      if (this.localFormData.hasOwnProperty('Acceptid')) {
        this.localFormData.Acceptid = this.localFormData.Acceptid.toString()
      }
      if (this.localFormData.hasOwnProperty('Type')) {
        this.localFormData.Type = this.localFormData.Type.toString()
      }
      if (this.localFormData.hasOwnProperty('Level')) {
        this.localFormData.Level = this.localFormData.Level.toString()
      }
      if (this.localFormData.hasOwnProperty('Os')) {
        this.localFormData.Os = this.localFormData.Os.toString()
      }
      if (this.localFormData.hasOwnProperty('Browser')) {
        this.localFormData.Browser = this.localFormData.Browser.toString()
      }
      if (this.localFormData.hasOwnProperty('Bussconfirmstatus')) {
        this.localFormData.Bussconfirmstatus = this.localFormData.Bussconfirmstatus.toString()
      }
      if (this.localFormData.hasOwnProperty('Env')) {
        this.localFormData.Env = this.localFormData.Env.toString()
      }
      if (!this.localFormData.hasOwnProperty('Desc') || this.localFormData.Desc === "") {
        this.$set(this.localFormData, 'Desc', '<p>重现步骤<br>[步骤]<br><br>[结果]<br><br>[期望]</p>')
      }
      if (this.localFormData.hasOwnProperty('Status')) {
        this.$set(this.localFormData, 'Status', this.localFormData.Status.toString())
      } else {
        this.$set(this.localFormData, 'Status', '0')
      }
    },
    getData () {
      if (this.localFormData.id) {
        projectTestApi.getDataById(this.localFormData).then(res => {
          if (res && res.Tests && res.Tests.length > 0) {
            this.localFormData = Object.assign({}, this.localFormData, res.Tests[0])
            this.initHandleData()
          }
        })
      } else {
        this.initHandleData()
      }
    }
  },
  watch: {
    dialogVisible: {
      handler (n, o) {
        if (n) {
          if (this.formData.Id) {
            this.localFormData.id = this.formData.Id
            this.components.forEach(it => {
              if (it.prop === 'Projectmoduleid' || it.prop === 'Acceptid') {
                if (!it.hasOwnProperty('attrs')) {
                  this.$set(it, 'attrs', {})
                }
                this.$set(it.attrs, 'queryValue', {
                  id: this.formData.Projectid
                })
                console.log(it)
              }
            })
          }
          this.getData()
        } else {
          this.localFormData = {}
        }
      }
    }
  }
}
</script>

<style scoped>

</style>
